<extend name="block/block" />
<block name="main">
    <section>
        <div class="main">
            <include file="./block/main_top" />
            <div class="main-box-course">
                <div class="main-box-content">
    <!--                this is the course item -->
                    <div class="course-item course-item-300">
                        <div class="course-cover">
                            <img src="__TMPL__/portal/public/assets/images/living.png" alt="直播中" class="course-state living">
                            <img alt="课程封面图" title="钢琴精品试学课" class="course-image" src="__TMPL__/portal/public/assets/images/trial/001.png" lazy="loaded">
                            <span class="total-student"> 1.6w人在看 </span>
                        </div>
<!--                  this is the hover-->
                        <div class="course-mask">
                            <img src="__TMPL__/portal/public/assets/images/mask-video.png">
                        </div>
                        <h4 class="course-title">传统的大潘</h4>
                        <span class="course-chapters">《一抹江南色》山水</span>
                        <div class="course-teacher">
                            <img src="__TMPL__/portal/public/assets/images/trial/avator.jpeg" alt="讲师头像">
                            <span>大潘老师</span>
                        </div>
                    </div>

                    <div class="course-item course-item-300">
                        <div class="course-cover">
                            <span class="course-state end">已结束</span>
                            <img alt="课程封面图" title="钢琴精品试学课" class="course-image"  src="__TMPL__/portal/public/assets/images/trial/002.png" lazy="loaded">
                            <span class="total-student"> 1.9w人在看 </span>
                        </div>
                        <!--                  this is the hover-->
                        <div class="course-mask">
                            <img src="__TMPL__/portal/public/assets/images/mask-video.png">
                        </div>
                        <h4 class="course-title">宁静的维远</h4>
                        <span class="course-chapters">《一抹江南色》山水</span>
                        <div class="course-teacher">
                            <img src="__TMPL__/portal/public/assets/images/trial/avator.jpeg" alt="讲师头像">
                            <span>大潘老师</span>
                        </div>
                    </div>

                    <div class="course-item course-item-300">
                        <div class="course-cover">
                            <span class="course-state end">已结束</span>
                            <img alt="课程封面图" title="钢琴精品试学课" class="course-image"  src="__TMPL__/portal/public/assets/images/trial/002.png" lazy="loaded">
                            <span class="total-student"> 1.9w人在看 </span>
                        </div>
                        <!--                  this is the hover-->
                        <div class="course-mask">
                            <img src="__TMPL__/portal/public/assets/images/mask-video.png">
                        </div>
                        <h4 class="course-title">悠然的文强</h4>
                        <span class="course-chapters">《一抹江南色》山水</span>
                        <div class="course-teacher">
                            <img src="__TMPL__/portal/public/assets/images/trial/avator.jpeg" alt="讲师头像">
                            <span>大潘老师</span>
                        </div>
                    </div>

                    <div class="course-item course-item-300">
                        <div class="course-cover">
                            <span class="course-state end">已结束</span>
                            <img alt="课程封面图" title="钢琴精品试学课" class="course-image"  src="__TMPL__/portal/public/assets/images/trial/002.png" lazy="loaded">
                            <span class="total-student"> 1.9w人在看 </span>
                        </div>
                        <!--                  this is the hover-->
                        <div class="course-mask">
                            <img src="__TMPL__/portal/public/assets/images/mask-video.png">
                        </div>
                        <h4 class="course-title">耐心的高翔</h4>
                        <span class="course-chapters">《一抹江南色》山水</span>
                        <div class="course-teacher">
                            <img src="__TMPL__/portal/public/assets/images/trial/avator.jpeg" alt="讲师头像">
                            <span>大潘老师</span>
                        </div>
                    </div>

                    <div class="course-item course-item-300">
                        <div class="course-cover">
                            <span class="course-state end">已结束</span>
                            <img alt="课程封面图" title="钢琴精品试学课" class="course-image"  src="__TMPL__/portal/public/assets/images/trial/002.png" lazy="loaded">
                            <span class="total-student"> 1.9w人在看 </span>
                        </div>
                        <!--                  this is the hover-->
                        <div class="course-mask">
                            <img src="__TMPL__/portal/public/assets/images/mask-video.png">
                        </div>
                        <h4 class="course-title">豁达的知秋</h4>
                        <span class="course-chapters">《一抹江南色》山水</span>
                        <div class="course-teacher">
                            <img src="__TMPL__/portal/public/assets/images/trial/avator.jpeg" alt="讲师头像">
                            <span>大潘老师</span>
                        </div>
                    </div>

                    <div class="course-item course-item-300">
                        <div class="course-cover">
                            <span class="course-state end">已结束</span>
                            <img alt="课程封面图" title="钢琴精品试学课" class="course-image"  src="__TMPL__/portal/public/assets/images/trial/002.png" lazy="loaded">
                            <span class="total-student"> 1.9w人在看 </span>
                        </div>
                        <!--                  this is the hover-->
                        <div class="course-mask">
                            <img src="__TMPL__/portal/public/assets/images/mask-video.png">
                        </div>
                        <h4 class="course-title">千变的梦柯</h4>
                        <span class="course-chapters">《一抹江南色》山水</span>
                        <div class="course-teacher">
                            <img src="__TMPL__/portal/public/assets/images/trial/avator.jpeg" alt="讲师头像">
                            <span>大潘老师</span>
                        </div>
                    </div>

                </div>
            </div>
            <include file="./block/page" />
        </div>
    </section>

</block>
<block name="myscript">
    <script>
        $('.course-item').click(function () {
            if($(this).find('.course-state').html() == '已结束'){
                $('#endLiving').modal('show');
            }else{
                location.href = "{:url('portal/index/trial_detail')}"
            }
        });

    </script>
</block>